<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8" />
    <title>修改密码_资源共享平台</title>
    <link rel="stylesheet" href="/layui/css/layui.css"/>
    <style type="text/css">
        .layui-container {
            max-width: 600px;
            margin-top: 50px;
        }
        .layui-form-label {
            width: 84px;
        }
        .layui-input-block {
            margin-left: 114px;
        }
    </style>
</head>
<body>
<div class="layui-container">
    <form class="layui-form" name="myForm" method="post">
        <div class="layui-form-item">
            <label class="layui-form-label">原密码：</label>
            <div class="layui-input-block">
                <input type="password" name="oldPassword" class="layui-input" lay-verify="required" lay-reqText="请输入原密码" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">新密码：</label>
            <div class="layui-input-block">
                <input type="password" id="password" name="password" class="layui-input" lay-verify="required|password" lay-reqText="请输入新密码" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">确认新密码：</label>
            <div class="layui-input-block">
                <input type="password" id="password2" class="layui-input" lay-verify="required|password" lay-reqText="请输入确认新密码" />
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit="" lay-filter="*">提交</button>
                &nbsp;&nbsp;<label id="errorInfo" style="color: red;"></label>
            </div>
        </div>
    </form>
</div>

<script src="/layui/layui.js"></script>
<script type="text/javascript" th:inline="javascript">
    layui.use(['layer', 'form', 'element'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            form = layui.form;

        // 定义验证规则
        form.verify({
            password: function (value, item) {
                if (!/^[\S]{6,12}$/.test(value)) {
                    return '密码必须6到12位，且不能出现空格';
                }
                if ($("#password").val().trim() != $("#password2").val().trim()) {
                    return "两次新密码不一致！";
                }
            }
        });

        // 监听提交
        form.on('submit(*)', function (data) {
            $.post("/user/updatePassword", data.field, function (result) {
                if (result.success) {
                    layer.alert("密码修改成功，下一次登录生效！", function (index) {
                        parent.layer.closeAll();
                    });
                } else {
                    $("#errorInfo").text(result.errorInfo);
                }
            }, "json");
            return false;
        });
    });
</script>
</body>
</html>